import { View, Image } from "@tarojs/components"
import { useState } from "react";
import Taro from "@tarojs/taro";
import { AtInput } from "taro-ui"
import moment from 'moment';
import { AtMessage } from 'taro-ui'
import issue from "../../pages/postBar/img/issue.png";

const PublicationComments = (props) => {

    const [my_comments, setData] = useState(undefined)
    // 信息操作提醒
    const mesg = (type) => {
        Taro.atMessage({
            'message': type == "error" ? '请填写评论' : "评论成功",
            'type': type,
            duration: 2000,
        })
    }
    // console.log("帖子信息:", props.props)
    const handleChange = () => {
        if (my_comments === undefined) {
            mesg("error")
            return
        }
        const newData = {
            forum_title: props.props.title,
            person_name: Taro.getStorageSync("userInfo").nickName,
            comments_url: Taro.getStorageSync("userInfo").avatarUrl,
            comments_contents: my_comments,
            content_id: props.props.forum_id,
            comments_time: moment().format('YYYY-MM-DD:HH:MM:SS'),
            cmt_id: Taro.getStorageSync("openid")
        }
        // 评论成功信息提示
        mesg("success")

        console.log("你写的评论是:", newData)
        Taro.cloud.callFunction({
            name: "comments",
            data: {
                $url: "Comment",
                data: newData
            }
        }).then(res => {
            console.log("云函数返回的东西:", res)
        })
        //清空输入框
        setData(undefined)
    }

    return (
        // <View>
        //     {/* 弹出评论框 */}
        //     <View className="ATInput">
        //         <AtInput
        //             name="value"
        //             title="评论"
        //             type="text"
        //             value={my_comments}
        //             onChange={value => { setData(value) }}
        //             placeholder="友善发言，文明评论"
        //         />
        //         {/* 发送按钮 */}
        //         <AtMessage />
        //         <Image style="width: 35px;height: 35px" src={issue} onClick={handleChange} />
        //     </View>
        // </View>

        <View className="index_bottom">
        {/*底部输入框*/}
        <AtInput
          className="input_text"
          type="text"
          placeholder="说说你的看法..."
          placeholderStyle="color:#5e5e65"
          border={false}
        //   maxLength={120}
          value={my_comments}
          onChange={value => { setData(value) }}
        //   onBlur={isOnBlur}
        //   onKeyboardHeightChange={isOnkey}
        />
        {/* 发送按钮 */}
        <AtMessage />
        <View className="bottom-nav">
          {/* <View className='icon-send' onClick={handleChange}>发布</View> */}
          <Image style="width: 25px;height: 25px" className='icon-send' src={issue} onClick={handleChange}/>
        </View>
      </View>
    )
}
export default PublicationComments